<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"
	contentType="text/html; charset=UTF-8"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>节假日设置</title>
<link rel="stylesheet" type="text/css"
	href="<%=path%>/jquery-easyui/themes/default/easyui.css">
<link rel="stylesheet" type="text/css"
	href="<%=path%>/jquery-easyui/themes/icon.css">
<script type="text/javascript"
	src="<%=path%>/jquery-easyui/jquery-1.8.0.js"></script>
<script type="text/javascript"
	src="<%=path%>/jquery-easyui/jquery.easyui.min.js"></script>
<script type="text/javascript"
	src="<%=path%>/jquery-easyui/locale/easyui-lang-zh_CN.js"></script>
<script type="text/javascript" src="<%=path%>/js/jquery.json-2.4.js"></script>
<script type="text/javascript" src="<%=path%>/js/post.js"></script>
<script type="text/javascript">
	var path = '${pageContext.request.contextPath}';
	
	function formatHoliday(val,row){
		if (val == '休'){
			return '<span style="color:red;">'+val+'</span>';
		} else {
			return val;
		}
	}

	function onClickCell(rowIndex, field, value) {
		if (field.indexOf('d') != 0 || !value) {
			return;
		}
		var grid = $('#gridEdit');
		var data = grid.datagrid('getData');
		if (!data || !data.rows) {
			return;
		}
		var row = data.rows[rowIndex];
		for ( var p in row) {
			if (p != field) {
				continue;
			}
			var isHolidayDate = value == '休';
			if (isHolidayDate) {
				row[p] = '工';
				row.holidays--;
				row.workdays++;
			} else {
				row[p] = '休';
				row.holidays++;
				row.workdays--;
			}
			grid.datagrid('refreshRow', rowIndex);
			break;
		}
	}

	function save() {
		var grid = $('#gridEdit');
		var data = grid.datagrid('getData');
		if (!data || !data.rows || data.rows.leng) {
			return;
		}

		var year = $('#inputYear').numberspinner('getValue');
		if (!year || year == null || year == undefined 
			|| year == 'undefined' ||year == 0 || year.length == 0) {
			var dialog = $('#dlgEdit');
			var options = dialog.panel('options');
			year = options.title.substring(0 , 4);
		}

		var array = [];
		$.each(data.rows, function(index, value) {
			for ( var field in value) {
				if (field.indexOf('d') != 0) {
					continue;
				}
				if (value[field] == '休') {
					var f = field.substring(1, field.length);
					var d = year + '-' + (index + 1) + '-' + f;
					array.push(d);
				}
			}
		});

		var url = path + '/holiday/save/';
		var list = JSON.stringify(array);
		var dialog = $('#dlgEdit');

		postData(dialog, null, $('#grid'), url, list);
	}

	function edit() {
		var grid = $('#grid');
		var row = grid.datagrid('getSelected');
		if (!row) {
			$.messager.alert('提示', '请选择数据!');
			return;
		}

		grid = $('#gridEdit');
		grid.datagrid('loadData', row.months);
		var dialog = $('#dlgEdit');
		dialog.dialog('setTitle', row.year + '年节假日设置');
		dialog.dialog('open');
	}

	function del() {
		var grid = $('#grid');
		var row = grid.datagrid('getSelected');
		if (!row) {
			$.messager.alert('提示', '请选择数据!');
			return;
		}

		$.messager.confirm('询问', '确定要删除' + row.year + '年的节假日设置?', function(r) {
			if (!r) {
				return;
			}

			var path = "${pageContext.request.contextPath}";
			var url = path + '/holiday/delete/';
			$.ajax({
				type : "POST",
				url : url,
				data : "year=" + row.year,
				success : function(data) {
					grid.datagrid('reload');
				}
			});
		});
	}
	function showYear() {
		var date = new Date();
		$('#inputYear').numberspinner('setValue', date.getFullYear());
		$('#dlgYear').dialog('open');
	}

	function loadYear() {
		var year = $('#inputYear').numberspinner('getValue');
		if (year.length != 4) {
			return;
		}

		var url = path + '/holiday/create/';
		var data = "year=" + year;

		getData(url, data, function(d) {
			if (!d) {
				$.messager.alert('提示', '年份已经被创建，无法重复创建!', 'warning');
				return;
			}
			$('#dlgYear').dialog('close');
			var grid = $('#gridEdit');
			grid.datagrid('loadData', d.months);
			var dialog = $('#dlgEdit');
			dialog.dialog('setTitle', year + '年节假日设置');
			dialog.dialog('open');
		});
	}
</script>
</head>
<body class="easyui-layout">

	<!-- 输入年份窗體 -->
	<div id="dlgYear" class="easyui-dialog" title="输入年份"
		style="width:200px;height:120px;padding:10px"
		data-options="
				closed: true,
				modal: true,
				iconCls: 'icon-save',				
				buttons: [{
					text:'確定',
					iconCls:'icon-ok',
					handler:function(){
						loadYear();
					}
				},{
					text:'取消',
					iconCls:'icon-cancel',
					handler:function(){
						$('#dlgYear').dialog('close');
					}
				}]
			">
		<table>
			<tr>
				<td>年份:</td>
				<td><input id="inputYear" class="easyui-numberspinner"
					data-options="min:2010,max:2090,required:true" style="width:100px;" />
				</td>
			</tr>
		</table>
	</div>

	<!-- 节假日编辑窗体 -->
	<div id="dlgEdit" class="easyui-dialog" title="节假日设置"
		style="width:780px;height:420px;padding:10px"
		data-options="
				closed: true,
				modal: true,
				iconCls: 'icon-save',				
				buttons: [{
					text:'確定',
					iconCls:'icon-ok',
					handler:function(){
						save();
					}
				},{
					text:'取消',
					iconCls:'icon-cancel',
					handler:function(){
						$('#dlgEdit').dialog('close');
					}
				}]
			">
		<table id="gridEdit" class="easyui-datagrid"
			data-options="
			remoteSort: false,
			idField: 'month',
			fit: true,
			singleSelect: true,
			collapsible: true,
			rownumbers: false,
			striped: true,
			onClickCell: onClickCell
			">
			<thead data-options="frozen:true">
				<tr>
					<th data-options="field:'month',width:30,align:'center'">月份</th>
					<th data-options="field:'workdays',width:40,align:'right'">工作日</th>
					<th data-options="field:'holidays',width:40,align:'right'">节假日</th>
				</tr>
			</thead>
			<thead>
				<tr>
					<th
						data-options="field:'d1',width:30,align:'center',formatter:formatHoliday">1日</th>
					<th
						data-options="field:'d2',width:30,align:'center',formatter:formatHoliday">2日</th>
					<th
						data-options="field:'d3',width:30,align:'center',formatter:formatHoliday">3日</th>
					<th
						data-options="field:'d4',width:30,align:'center',formatter:formatHoliday">4日</th>
					<th
						data-options="field:'d5',width:30,align:'center',formatter:formatHoliday">5日</th>
					<th
						data-options="field:'d6',width:30,align:'center',formatter:formatHoliday">6日</th>
					<th
						data-options="field:'d7',width:30,align:'center',formatter:formatHoliday">7日</th>
					<th
						data-options="field:'d8',width:30,align:'center',formatter:formatHoliday">8日</th>
					<th
						data-options="field:'d9',width:30,align:'center',formatter:formatHoliday">9日</th>
					<th
						data-options="field:'d10',width:30,align:'center',formatter:formatHoliday">10日</th>
					<th
						data-options="field:'d11',width:30,align:'center',formatter:formatHoliday">11日</th>
					<th
						data-options="field:'d12',width:30,align:'center',formatter:formatHoliday">12日</th>
					<th
						data-options="field:'d13',width:30,align:'center',formatter:formatHoliday">13日</th>
					<th
						data-options="field:'d14',width:30,align:'center',formatter:formatHoliday">14日</th>
					<th
						data-options="field:'d15',width:30,align:'center',formatter:formatHoliday">15日</th>
					<th
						data-options="field:'d16',width:30,align:'center',formatter:formatHoliday">16日</th>
					<th
						data-options="field:'d17',width:30,align:'center',formatter:formatHoliday">17日</th>
					<th
						data-options="field:'d18',width:30,align:'center',formatter:formatHoliday">18日</th>
					<th
						data-options="field:'d19',width:30,align:'center',formatter:formatHoliday">19日</th>
					<th
						data-options="field:'d20',width:30,align:'center',formatter:formatHoliday">20日</th>
					<th
						data-options="field:'d21',width:30,align:'center',formatter:formatHoliday">21日</th>
					<th
						data-options="field:'d22',width:30,align:'center',formatter:formatHoliday">22日</th>
					<th
						data-options="field:'d23',width:30,align:'center',formatter:formatHoliday">23日</th>
					<th
						data-options="field:'d24',width:30,align:'center',formatter:formatHoliday">24日</th>
					<th
						data-options="field:'d25',width:30,align:'center',formatter:formatHoliday">25日</th>
					<th
						data-options="field:'d26',width:30,align:'center',formatter:formatHoliday">26日</th>
					<th
						data-options="field:'d27',width:30,align:'center',formatter:formatHoliday">27日</th>
					<th
						data-options="field:'d28',width:30,align:'center',formatter:formatHoliday">28日</th>
					<th
						data-options="field:'d29',width:30,align:'center',formatter:formatHoliday">29日</th>
					<th
						data-options="field:'d30',width:30,align:'center',formatter:formatHoliday">30日</th>
					<th
						data-options="field:'d31',width:30,align:'center',formatter:formatHoliday">31日</th>
				</tr>
			</thead>
		</table>
	</div>

	<!-- 工具栏 -->
	<div id="tb" style="height:auto">

		<a href="#" class="easyui-linkbutton" iconCls="icon-add" plain="true"
			onclick="showYear()">添加</a> <a href="#" class="easyui-linkbutton"
			iconCls="icon-edit" plain="true" onclick="edit()">修改</a> <a href="#"
			class="easyui-linkbutton" iconCls="icon-remove" plain="true"
			onclick="del()">删除</a>
	</div>


	<div data-options="region:'center'">
		<table id="grid" class="easyui-datagrid"
			data-options="
			sortOrder:'desc',
			sortName:'year',
			remoteSort:false,
			idField:'year',
			fit:true,
			singleSelect:true,
			collapsible:true,
			url:'<%=path%>/holiday/loadAll/',
			toolbar:'#tb',
			striped: true,
			rownumbers:true
			">
			<thead>
				<tr>
					<th
						data-options="field:'year',width:160,sortable:true,align:'center'">年份</th>
					<th
						data-options="field:'workdays',width:180,sortable:true,align:'right'">工作日</th>
					<th
						data-options="field:'holidays',width:180,sortable:true,align:'right'">节假日</th>
				</tr>
			</thead>
		</table>

	</div>
</body>
</html>